<template>
	<view>
		<!-- 自定义头部 -->
		<view class="header-top-box">
			<!-- 1销货单，2退货单，3采购单，4订货单 -->
			<view class="header-top ffffff flexbetween" v-if="getmsg.type==1 || getmsg.type==9">
				<view class="top-image" @click="gotoBack()"></view>
				<view class="searchinput flexleft">
					<view class="searchimg"></view>
					<input type="text" placeholder="请输入内容" v-model="keywords" confirm-type="search" @confirm="getList">
				</view>
				<view class="zengpin" @click="selectZp">
					<view class="zp"></view>
					<view class="xiaotext">赠品</view>
				</view>
			</view>
			<view class="header-top ffffff flexbetween" v-else>
				<view class="top-image2" @click="gotoBack()"></view>
				<view class="searchinput2 flexleft">
					<view class="searchimg"></view>
					<input type="text" placeholder="请输入内容" v-model="keywords" confirm-type="search" @confirm="getList">
				</view>
			</view>
		</view>
		<view class="teshupadding">
			<view class="rightitem mainpadding" v-for="item in list" :key="item.id" @click.stop="checkgoods(item)">
				<view class="flexbetween">
					<view class="nostrongtext">{{item.goods_name}}</view>
					<view class="xuanzebtn" @click.stop="checkgoods(item)">选择</view>
				</view>
				<view class="flexbetween margin_top">
					<view class="gouwuche"></view>
					<view class="huisetext">{{item.inventory}}{{item.unit_name}}</view>
				</view>
			</view>
		</view>
		<view class="dibubox flexcenter ffffff">
			<view class="quedingbtn" @click="guwtjsp">确认({{ids.length}})</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				keywords: "",
				list: [],
				getmsg:{
					ck_id:'',//仓库id
					kh_id:"",
					yg_id:"",
					type:1,//1销货单，2退货单
					sp_code:'',//商品编号
					mr_sjstate:'',//默认价格
					goods_ids:[]
				},
				ids:[]
			}
		},
		onLoad(options) {
			let data = JSON.parse(decodeURIComponent(options.getmsg));
			this.getmsg = data
			// this.getList()
		},
		methods: {
			getList() {
				httpRequest.request('appapi/manage/goods/chooselist', 'POST', {
					store_id: 1, //仓库id
					inventory: 0, //库存:0=不限,1=有库存
					keyword: this.keywords, //关词
				}).then(res => {
					this.list = res.data
				})
			},
			// 返回上一页
			gotoBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			// 选择赠品
			selectZp(){
				let getmsg = {
						ck_id:this.getmsg.ck_id,//仓库id
						sp_code:this.getmsg.sp_code,//商品编号
						kh_id:this.getmsg.kh_id,
						yg_id:this.getmsg.yg_id,
						type:this.getmsg.type,//1销货单，2退货单
						mr_sjstate:this.getmsg.mr_sjstate,//默认价格
						goods_ids:[]
				}
				uni.navigateTo({
					url:'/pages/workbench/xiaoshou/zengpinlb?getmsg=' + encodeURIComponent(JSON.stringify(this.getmsg))
				})
			},
			guwtjsp() {
				if(this.getmsg.goods_ids.length==0){
					httpRequest.toast("请添加商品")
					return false
				}
				this.getmsg.goods_ids = this.newArrFn(this.ids)
				uni.navigateTo({
					url: '/pages/workbench/xiaoshou/tianjiaspgwcyskye?getmsg=' + encodeURIComponent(JSON.stringify(this.getmsg))
				})
			},
			newArrFn(arr) {
				arr = arr.sort()
				let newArr = []
				for (let i = 0; i < arr.length; i++) {
			 	arr[i] === arr[i - 1] ? newArr : newArr.push(arr[i])
				};
				return newArr
			},
			checkgoods(item) {
				this.ids.push(item.id)
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.xuanzebtn {
		font-size: 24rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #0BBDCB;
		width: 86rpx;
		height: 40rpx;
		background: rgba(11, 189, 203, .1);
		border-radius: 134rpx;
	}
	// 顶部自定义
	.header-top-box {
		height: 170rpx;
		width: 100%;
	}

	.header-top {
		width: 100%;
		box-sizing: border-box;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 2;
		background-color: #fff;
		padding: 96rpx 40rpx 10rpx;
	}

	.top-image {
		margin-top: 20rpx;
		width: 20rpx;
		height: 38rpx;
		background: url('@/static/image/system/return.png') no-repeat;
		background-size: 20rpx 38rpx;
	}
	.top-image2 {
		flex: 1;
		margin-top: 20rpx;
		width: 20rpx;
		height: 38rpx;
		background: url('@/static/image/system/return.png') no-repeat;
		background-size: 20rpx 38rpx;
	}

	// 自定义顶部搜索
	.searchinput {
		margin-top: 20rpx;
		background-color: #f7f7f7;
		border-radius: 50rpx;
		padding: 12rpx 20rpx;
		input {
			width: 100%;
		}
	}
	.searchinput2 {
		flex: 10;
		margin-top: 20rpx;
		background-color: #f7f7f7;
		border-radius: 50rpx;
		padding: 12rpx 20rpx;
		input {
			width: 100%;
		}
	}

	.searchimg {
		width: 34rpx;
		height: 34rpx;
		background-image: url("@/static/image/system/search.png");
		background-size: 100% 100%;
		margin-right: 30rpx;
	}

	.dibubox {
		padding: 30rpx 30rpx 70rpx;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		box-sizing: border-box;
	}

	.gouwuche {
		background-image: url('@/static/image/system/gouwuche.png');
		width: 44rpx;
		height: 44rpx;
		background-size: 100% 100%;
	}

	.huisetext {
		font-size: 20rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}

	.zengpin {
		margin-right: 20rpx;
	}

	.dhh {
		background-image: url('@/static/image/system/dhh.png');
		width: 34rpx;
		height: 34rpx;
		margin: auto;
		background-size: 100% 100%;
	}

	.xiaotext {
		font-size: 18rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.zp {
		background-image: url('@/static/image/system/zp.png');
		width: 34rpx;
		margin: auto;
		height: 34rpx;
		background-size: 100% 100%;
	}

	.gouwuche {
		background-image: url('@/static/image/system/gouwuche.png');
		width: 44rpx;
		height: 44rpx;
		background-size: 100% 100%;
	}

	.huisetext {
		font-size: 20rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}

	.Vector {
		background-image: url('@/static/image/system/Vector.png');
		width: 25rpx;
		height: 25rpx;
		background-size: 100% 100%;
	}

	.Vectorhuse {
		background-image: url('@/static/image/system/Vectorkong.png');
		width: 25rpx;
		height: 25rpx;
		background-size: 100% 100%;
	}

	.rightitem {
		border-bottom: 2rpx solid #f7f7f7;
	}

	.quedingbtn {
		width: 212rpx;
		height: 62rpx;
		font-size: 32rpx;
		background: linear-gradient(273deg, #0BBDCB 0%, #41D4E2 100%);
		border-radius: 41rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}

	.teshupadding {
		padding: 30rpx 30rpx 176rpx;
	}
</style>
